<!-- 富民速贴标题 -->
<template>
    <el-row>
        <el-col :span="24">
            <div class="grid-content bg-purple-dark discount-form-title">
                <div class="discount-form-title-con">
                    {{title}}
                </div>
            </div>
        </el-col>
    </el-row>
</template>

<script lang="ts">
    import { Vue, Component } from 'vue-property-decorator';
    @Component({
        props: ['title']
    })
    export default class DiscountTitle extends Vue {

    }
</script>

<style lang="scss" scoped>
    .discount-form-title {
        display: flex;
        justify-content: center;
    }
    .discount-form-title-con {
        width: 84%;
        height: $height-int-register;
        background: $__color-bg-primary;
        display: flex;
        align-items: center;
        &:before {
            content: '';
            display: inline-block;
            width: 4px;
            height: $height-int-register;
            background: $__color-primary;
            margin-right: 12px;
            border-bottom-left-radius: 4px;
            border-top-left-radius: 4px;
        }
    }
</style>